<?php 
session_start();
include("db_connect.php")
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="Basciautosales store the place where you can buy trade set build your own dream cars at its your ways" />
<meta name="description" content="Basciautosales store the place where you can buy trade set build your own dream cars at its your ways" />

<?php include("include/jquery.php");?>

<script>
$(document).ready(function(){
	
	var fname = $("#fname");
	var lname = $("#lname");
	var gender=$("#gender");
	var contacts = $("#contacts");
	var email=$("#email");
	var barangay=$("#barangay");
	var city=$("#city");
	var province=$("#province");
	var address; 
	var username=$("#username");
	var password=$("#password");
	var password2=$("#password2");
	
	
	$("#_signup").click(function() {
		if(fname.val() == "" || fname.val() == " "){
			alert("Empty First name");
		}
		else if(lname.val() == "" || lname.val() == " "){
			alert("empty Last name");
		}
		else if(gender.val() == "Select Your Gender" || gender.val()== 0){
			alert("Select your gender");
		}
		else if(contacts.val() == "" || contacts.val() == " "){
			alert("empty Contact no.");
		}
		else if(isNaN(contacts.val()) ){
			alert("No. Only");
		}
		else if(barangay.val() == "" || barangay.val()== " "){
			alert("empty barangay");
		}
		else if(city.val() == "" || city.val() == " "){
			alert("empty city");
		}
		else if(province.val() == "" || province.val() == " "){
			alert("empty province");
		}
		else if(email.val() == "" || email.val() == " "){
			alert("empty email");
		}
		else if(!isValidEmail( email.val() ) ){
			alert("input a valid email")
		}
		else{
			address = barangay.val() +","+ city.val() + "," + province.val(); 
			
			isExistemail(fname, lname, gender, contacts, email, address, username, password);
		}
	});
	
	
	

function isExistemail(fname, lname, gender, contacts, email, address, username, password){
	
		$.ajax ({
			url:"scripts/isemail_exist.php?email="+email.val(),
				success:function(data){
				
					if(data == 1){
						alert("Email Already Exist");
					}
					else{
						if(password.val() == "" || password.val() == " "){
						alert("empty password");
						}
						else if(password2.val() == "" || password2.val() == " "){
							alert("empty retry password");
						}
						else if(password.val() != password2.val()){
							alert("Password didnt match")
						}
						else{
						checkusername(fname, lname, gender, contacts, email, address, username, password);
						}
					
					}
					
			}
		});
		
	}//end of function isexistemail	
	



function checkusername(fname, lname, gender, contacts, email, address, username, password){
	
	if(username.val() == "" || username.val()== " "){
		alert("empty username");
	}
	else{
		$.ajax ({
				url:"scripts/isusername_exist.php?username="+username.val(),
					success:function(data){
						if(data == 1){
							alert("Username already exist");
						}
						else{
							add(fname, lname, gender, contacts, email, address, username, password);
						
						}
				}
			});
	}
}

function add(fname, lname, gender, contacts, email, address, username, password){
	
		var msg;
		$.ajax ({
			url: "scripts/newcostumer.php?username="+username.val() +"&password="+password.val() +"&fname="+ fname.val() +"&lname="+lname.val() +"&contacts="+contacts.val() +"&email="+email.val() +"&address="+address+"&gender="+gender.val(),
			success:function(data)
			{
			
			//alert(data);
				if(data == 1){
					
					msg = "You will recieved a verification code please check your email";
					$("#msgbox2").html(msg);
					$("#msgbox2").dialog({
							title:"",
							modal:true,
							width:300,
							height:200,
							show: "fade",
							hide: "fade",
							buttons:{
								"ok":function() {
									window.location.href = "index.php";
									$(this).dialog("close");
								}
							}

					});
				}
				else{
				
					msg = "Sorry, something went wrong! ";
					$("#msgbox2").html(data);
					$("#msgbox2").dialog({
							title:"",
							modal:true,
							width:300,
							height:200,
							show: "fade",
							hide: "fade",
							buttons:{
								"ok":function() {
									$(this).dialog("close");
								}
							}

					});
				}
			
			}
		});
	
	}

function isValidEmail(strEmail){
var validRegExp;
validRegExp = /^[^@]+@[^@]+.[a-z]{2,}$/i;
  // search email text for regular exp matches
    if (strEmail.search(validRegExp) == -1){
		return false;
    } 
    return true; 
}	

});
</script>

<style>
input[type="text"],input[type="password"],#gender
{
width:250px;
display:block;
margin-bottom:10px;
background-color:white;
}
#B{
font-size:20px;
}
</style>
</head>
<body> <div id="msgbox2"></div>

<div id="templatemo_wrapper">
	<!--header-->
		<?php include("include/header.php");?>
	<!--header-->
    
    <div id="templatemo_main">
   		<!--sidebar-->
		<div id="sidebar" class="float_l">
			<!--top-->
			<div class="sidebar_box">
				<h3>My Cart</h3>   
                <div class="content"> 
                	<div id="itemList"></div>
                </div>
				<br />
			</div>
        	<!--endtop-->
				
		</div><!--siderbar-->
		
		
        <div id="content" class="float_r" style="background-color:black; color:white;">
        	
            <h1 style="color:white;">Sign up</h1>
            <div class="content_half float_l">
				<table id="tbl_main" border="0">
					<span id="B">Personal Info</span>
					<tr>
						<td id="" colspan="4" class="tbl_d_d">
							<label>First Name:</label>
						</td>
					</tr>
					<tr>
						<td id="" colspan="4" class="tbl_d">
							<input type="text" id="fname" class="tbl_d">
						</td>
					</tr>
					
					<tr>
						<td id="" colspan="4" class="tbl_d_d">
							<label>Last Name:</label>
						</td>
					</tr>
					<tr>
						<td id="" colspan="4" class="tbl_d">
							<input type="text" id="lname" class="tbl_d">
						</td>
					</tr>
					
					<tr >
						<td id="" colspan="4" class="tbl_d_d">
							<label>Gender:</label>
						</td>
					</tr>
					
					<tr>
						<td id="" colspan="4" class="tbl_d">
							<select id="gender" class="tbl_d_resize" style="width:200px;" name="gender">
								<option value="0">Gender</option>
								<option value="Male">Male</option>
								<option value="Female">Female</option>
							</select>
						</td>
					</tr>
					
					<tr>
						<td id="" colspan="4" class="tbl_d_d">
							<label>Contact No.:</label>
						</td>
					</tr>
					<tr>
						<td id="" colspan="4" class="tbl_d">
							<input type="text" id="contacts" class="tbl_d">
						</td>
					</tr>
					
						
					
					<tr  class="tbl_d">
						<td colspan="4" id="B" class="tbl_d_d" colspan="4"><label>Address</label></td>
					</tr>
					
					<tr>
						<td id="" colspan="4" class="tbl_d_d">
							<label style="font-size:15px;">Barangay:</label>
						</td>
					</tr>
					
					<tr>
						<td id="" colspan="4" class="tbl_d">
							<input type="text" id="barangay" class="tbl_d">
						</td>
					</tr>
					
					<tr>
						<td id="" colspan="4" class="tbl_d_d">
							<label style="font-size:15px;">Municipalicity/City:</label>
						</td>
					</tr>
					
					<tr>
						<td id="" colspan="4" class="tbl_d">
							<input type="text" id="city" class="tbl_d">
						</td>
					</tr>
					
					<tr>
						<td id="" colspan="4" class="tbl_d_d">
							<label style="font-size:15px;">Province:</label>
						</td>
					</tr>
					
					<tr>
						<td id="" colspan="4" class="tbl_d">
							<input type="text" id="province" class="tbl_d">
						</td>
					</tr>
					
					
						
				
				</table>
                
            </div>
        <div class="content_half float_r">
        		<table>
				<tr>
						<td id="" colspan="4" class="tbl_d_d">
							<label>Email:</label>
						</td>
					</tr>
					
					<tr>
						<td id="" colspan="4" class="tbl_d">
							<input type="text" id="email" class="tbl_d">
						</td>
					</tr>
					
					<tr>
						<td id="" colspan="4" class="tbl_d_d">
							<label>Username:</label>
						</td>
					</tr>
					<tr>
						<td id="" colspan="4" class="tbl_d">
							<input type="text" id="username" class="tbl_d">
						</td>
					</tr>
							
					<tr>
						<td id="" colspan="4" class="tbl_d_d">
							<label>Password:</label>
						</td>
					</tr>
					<tr>
						<td id="" colspan="4" class="tbl_d">
							<input type="password" id="password" class="tbl_d">
						</td>
					</tr>
					
					<tr>
						<td id="" colspan="4" class="tbl_d_d">
							<label>Retype Password:</label>
						</td>
					</tr>
					<tr>
						<td id="" colspan="4" class="tbl_d">
							<input type="password" id="password2" class="tbl_d">
						</td>
					</tr>
					
					<tr>
						
						<td><button id="_signup">Sign up</button></td>
					</tr>
			</table>
        </div>
        
        <div class="cleaner h40"></div>
           
        </div> 
        <div class="cleaner"></div>
    </div> <!-- END of templatemo_main -->
    
    <!--footer-->
	<?php include("include/footer.php");?>
    
</div> <!-- END of templatemo_wrapper -->

</body>
</html>